<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
    <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
    <title>白条登记</title>
    <link rel="stylesheet" type="text/css" href="../css/mui.min.css" />
    <link rel="stylesheet" type="text/css" href="../css/common.css" />
    <link rel="stylesheet" href="../css/mui.picker.min.css">
    <style type="text/css">
        .detail {
            padding-right: 20px!important;
        }

        h5 {
            color: #0062CC;
        }

        .mui-navigate-right .mui-col-xs-8 {
            width: 62.666667%!important;
        }

        .mui-text-right input,
        .mui-text-right textarea {
            border: 0;
            font-size: 14px;
            font-weight: 400;
            color: #8f8f94;
            margin-bottom: 0;
            text-align: right;
        }

        .flex_first{
          display: flex;
          align-items: flex-start;
        }

        .padding_r_18{
          padding: 0 16px 0 0;
        }
    </style>
</head>

<body>
    <div class="mui-content content-padded_bottom">
        <ul class="mui-table-view mui-table-view-chevron">
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">SGMW ID：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="matusetransid"></span>
                    </div>
                </div>
            </li>
        </ul>
        <ul class="mui-table-view mui-table-view-chevron type_list_spair">
            <li class="mui-table-view-cell detail" onclick="openSelOrder()">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">工单：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="refwo">请选择工单</span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">状态：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span id="stauts" class="mui-h5"></span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">位置：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="address"></span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">交易类型：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <select class="mui-h5" style="direction:rtl;margin:auto;padding: 0;" id="issuetype">
                           <option value="发放">发放</option>
                           <option value="退回">退回</option>
                         </select>
                    </div>
                </div>
            </li>
        </ul>
        <ul class="mui-table-view mui-table-view-chevron type_list_spair">
            <li class="mui-table-view-cell detail">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">领料人：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="issuerto">请选择领料人</span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">姓名：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="name"></span>
                    </div>
                </div>
            </li>
        </ul>
        <ul class="mui-table-view mui-table-view-chevron type_list_spair">
            <li class="mui-table-view-cell detail">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">货柜：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="binnum">请选择货柜</span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail">
                <div class="mui-table mui-navigate-right">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">发放日期：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <span class="mui-h5" id="actualdate">请选择日期</span>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail">
                <div class="mui-table">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">发放数量：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right no_padding">
                        <input type="number" placeholder="请输入数量" id="quantity"/>
                    </div>
                </div>
            </li>
            <li class="mui-table-view-cell detail">
                <div class="mui-table flex_first">
                    <div class="mui-table-cell mui-col-xs-4">
                        <h5 class="mui-ellipsis">描述：</h5>
                    </div>
                    <div class="mui-table-cell mui-col-xs-8 mui-text-right">
                        <textarea class="padding_r_16" id="description" name="" rows="" cols="" placeholder="请输入描述"></textarea>
                    </div>
                </div>
            </li>
        </ul>
    </div>
</body>
<script type="text/javascript" src="../script/api.js"></script>
<script src="../script/mui.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../script/common.js" type="text/javascript" charset="utf-8"></script>
<script src="../script/mui.picker.min.js"></script>
<script type="text/javascript">
  apiready = function () {
    $api.html($api.byId('matusetransid'),api.pageParam.itemnum);
    onLoadDetail()
    api.parseTapmode();
    api.addEventListener({
        name: 'selOrder'
    }, function(ret, err) {
      console.log(JSON.stringify(ret.value))
       $api.html($api.byId('refwo'),ret.value.wonum);
       $api.html($api.byId('stauts'),ret.value.selOrderStatus);
       $api.html($api.byId('address'),ret.value.selOrderAddress);
    })
    api.addEventListener({
      name:'navitembtn'
    },function(ret, err){
      if(ret.type == 'right'){
        if($api.html($api.byId('refwo')) == '请选择工单'){
          Toast('请选择工单');
          return false
        }
       ajaxrd("updateBlankNote",{
         matusetransid:api.pageParam.matusetransid,
         refwo:$api.html($api.byId('refwo')),
       },function(data){
         Toast('登记成功');
         api.sendEvent({
            name: 'refersh',
            extra: {
                isrefersh: 'yes'
            }
        });
         setTimeout(function(){api.closeWin();},300)
       })
      }
    })
  }
  function openSelOrder(){
    openWin('work_order_sel_order','选择工单',{
          background: '#6098de',
          color: '#fff',
          rightButtons:[{
            iconPath:"widget://image/save-icon.png"
          }]
      })
  }
  function onLoadDetail() {
      ajaxrd("queryCheckOutDetail", {
        matusetransid: api.pageParam.matusetransid
      }, function(ret, err) {
          api.refreshHeaderLoadDone();
          $api.val($api.byId('issuetype'),ret.issuetype)
          $api.html($api.byId('issuerto'),ret.issueto)
          $api.html($api.byId('name'),ret.issuertoName)
          $api.html($api.byId('binnum'),ret.binnum)
          $api.html($api.byId('actualdate'),ret.actualdate)
          $api.val($api.byId('quantity'),ret.quantity)
          $api.val($api.byId('description'),ret.description)
      })
  }
</script>

</html>
